<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <title>个人信息- 千锋新闻</title>
    <link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/reset.css',_external=True) }}">
    <link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/animate.css',_external=True) }}">
    <link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/style.css',_external=True) }}">
    <link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/cityLayout.css',_external=True) }}">
    <link rel="stylesheet" type="text/css"
          href="{{ url_for('static',filename='css/lq.datetimepick.css',_external=True) }}"/>
    <script src="{{ url_for('static',filename='js/jquery.min.js',_external=True) }}" type="text/javascript"></script>
    <script src="{{ url_for('static',filename='js/jquery-migrate-1.2.1.min.js',_external=True) }}"
            type="text/javascript"></script>
    <style>
        .sex i {
            float: right;
        }

        .form-sex li {
            float: right;
        }

        .form-email {
            width: 300px;
            height: 30px;
            margin-left: 20px;
        }
    </style>
</head>
<body>
<section class="headerwrap headerwrap2">
    <header>
        <div class="header2 header">
            <div class="top">
                <div class="wp">
                    <div class="fl"><p>服务电话：<b>33333333</b></p></div>
                    <div style="float: right"><a href="{{ url_for("index.home") }}" style="color: white">回到首页</a></div>
                </div>
            </div>
            <div class="middle">
                <div class="wp">
                    <h1>我的个人中心</h1>
                </div>
            </div>
        </div>
    </header>
</section>
<section>
    <div class="wp">
        <ul class="crumbs">
            <li><a href="{{ url_for("index.home") }}">首页</a>></li>
            <li><a href="#">个人中心</a>></li>
            <li>个人信息</li>
        </ul>
    </div>
</section>

<section>
    <div class="wp list personal_list">
        <div class="left">
            <ul>
                <li class="active2"><a href="{{ url_for("account.center") }}">个人资料</a></li>
                <li><a href="{{ url_for('account.update') }}">修改密码</a></li>
                <li><a href="{{ url_for('account.store') }}">我的收藏</a></li>
            </ul>
        </div>
        <div class="right">
            <div class="personal_des ">
                <div class="head" style="border:1px solid #eaeaea;">
                    <h1>个人信息</h1>
                </div>
                <div class="inforcon">
                    <form class="perinform" id="jsEditUserForm" autocomplete="off"
                          action="{{ url_for('account.center') }}" method="post" enctype="multipart/form-data">
                        <div class="left" style="width:242px;">
                            <iframe id='frameFile' name='frameFile' style='display: none;'></iframe>
                            <label class="changearea" for="avatarUp">
                            <span id="avatardiv" class="pic">
                                <img width="100" height="100" class="js-img-show" id="avatarShow"
                                     src="{{ user.head_img }}"/>
                            </span>
                                <span class="fl upload-inp-box" style="margin-left:70px;">
                                <span class="button btn-green btn-w100" id="jsAvatarBtn">修改头像</span>
                                <input type="file" name="img" id="avatarUp" class="js-img-up"/>
                            </span>
                            </label>
                            <input type='hidden' name='csrfmiddlewaretoken' value='799Y6iPeEDNSGvrTu3noBrO4MBLv6enY'/>
                        </div>
                        <ul class="right">
                            <li>昵&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;称：
                                {{ form.username }}
                                <i class="error-tips"></i>
                            </li>
                            <li>生&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;日：
                                {{ form.birthday }}
                                <i class="error-tips"></i>
                            </li>
                            <li class="sex">性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;别：
                                <i style="margin-right: 435px">{{ form.sex }}</i>
                                <i class="error-tips"></i>
                            </li>
                            <li>邮&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;箱：
                                {{ form.email }}
                            </li>
                            {{ form.csrf_token }}
                            <li class="button heibtn">
                                <input type="submit" id="jsEditUserBtn" value="保存">
                                <p>
                                    {% for error in errors %}
                                        <span style="color: red;position: absolute;left: 0">{{ error[0] }}</span>
                                    {% endfor %}
                                </p>
                            </li>
                        </ul>
                        <input type='hidden' name='csrfmiddlewaretoken' value='799Y6iPeEDNSGvrTu3noBrO4MBLv6enY'/>
                    </form>
                </div>
            </div>
        </div>
    </div>
</section>
<div class="bg" id="dialogBg"></div>
</body>
<script>
    document.querySelector('.form-username').value = '{{ user.username }}';
    document.querySelector('.form-email').value = '{{ user.email }}';
    var birthday = document.querySelector('.form-birthday');
    if (birthday != null) {
        birthday.value = '{{ user.birthday }}';
    }
    else {
        birthday.value = '保密';
    }
    var sex = document.querySelector('.form-sex').value = '{{ user.sex }}';
    if (sex) {
        $("input[name='sex']").get(sex).checked = true;
    }
</script>
</html>
